<template>
  <div class="container member">
    <div class="layout">
      <div>
        <router-link to="/member/like" class="my-link">个人信息</router-link>
      </div>
      <div>
        <router-link to="/member/avator" class="my-link">猜你喜欢</router-link>
      </div>
    </div>
    <div class="component"><RouterView></RouterView></div>
  </div>
</template>
<style lang="scss" scoped>
.member {
  display: flex;
  justify-content: space-between;
  .layout {
    border: 1px solid $xtxColor;
    margin-right: 20px;
    div {
      width: 150px;
      text-align: center;
      font-size: 30px;
      background-color: #fff;
      height: 150px;
      padding-top: 20px;
      .my-link:hover {
        color: $xtxColor;
      }
    }
  }
  .component {
    border: 1px solid $xtxColor;
    flex: 1;
  }
}
</style>
